<template>
	<view class="shop-amend-page">
		<view class="basics-msg">
			<view class="basics-msg-logo">
				<image :src="logo" mode=""></image>
				<view class="" @click="replaceLogo">更换logo</view>
			</view>
			<view class="explain-title">
				<view class=""></view>
				<view class="">
					基础信息
				</view>
			</view>
			<view class="basics-msg-details">
				<view class="">店铺名称</view>
				<view class="">
					<input type="text" v-model="item.name" placeholder="请输入店铺名称"/>
					<image :src="imglink + 'member/management_icon_textdelete.png'" mode="" @click="emptyData('1')"></image>
				</view>
			</view>
			<view class="basics-msg-addre">
				<view class="">所在地区</view>
				<view class="" style="margin-left: 40upx; display: flex;justify-content: space-between;flex-grow: 1;" @click="chooseCity">
					<input type="text" disabled v-model="pickerText" placeholder="请选择省、市、区（县)"/>
					<image :src="imglink + 'home/arrow-right.png'" mode=""></image>
				</view>
			</view>
			<view class="basics-msg-details-addre">
				<view class="">详细地址</view>
				<view class="basics-msg-details-msg">
					<textarea type="text" v-model="item.address" placeholder="请输入详细地址"/>
					<image :src="imglink + 'member/management_icon_textdelete.png'" mode="" @click="emptyData('2')"></image>
				</view>
			</view>
			<view class="basics-msg-addre" @click="location">
				<view class="">地址定位</view>
				<view class="" style="margin-left: 40upx; display: flex;justify-content: space-between;flex-grow: 1;">
					<input type="text" disabled v-model="item.long_lati_local" placeholder="点击定位"/>
					<image style="width: 40upx; height: 40upx;" :src="imglink + 'recommend/location_Hui.svg'"></image>
				</view>
			</view>
			<view class="">
				<view class="collect-information">
					培训科目
				</view>
				<view class="arrange">
					<view class="collect-reversal" :class="{'reversal': item.is_check == 1}" @click="choseForm(item)" 
						v-for="(item,index) in subject">{{item.name}}</view>
				</view>
			</view>
		</view>
		<view class="basics-msg-person">
			<view class="basics-msg-person-name">
				<view class="">联系人</view>
				<view class="">
					<input type="text" v-model="item.contact" placeholder="请输入联系人姓名"/>
					<image :src="imglink + 'member/management_icon_textdelete.png'" mode="" @click="emptyData('3')"></image>
				</view>
			</view>
			<view class="basics-msg-person-name">
				<view class="">联系号码</view>
				<view class="" style="margin-left: 40upx;">
					<input type="text" v-model="item.telephone" placeholder="请输入联系人号码"/>
					<image :src="imglink + 'member/management_icon_textdelete.png'" mode="" @click="emptyData('4')"></image>
				</view>
			</view><view class="basics-msg-person-name">
				<view class="">老师微信号</view>
				<view class="" style="margin-left: 40upx;">
					<input type="text" v-model="item.wechat_number" placeholder="请输入老师微信号"/>
					<image :src="imglink + 'member/management_icon_textdelete.png'" mode="" @click="emptyData('5')"></image>
				</view>
			</view>
			<view class="uplode-code">
				上传机构联系人微信二维码
			</view>
			<view class="uplode-code-details">
				<view class="uplode-code-details-content">
					<view class="uplode-code-content">
						<view class="">上传老师微信二维码图片</view>
						<view class="uplode-code-content-details" @click="uplodeCode" v-if="item.wechat_qrcode ==null || item.wechat_qrcode ==''">
							<image :src="imglink + 'member/add-code.png'" mode=""></image>
							<view class="">
								上传图片
							</view>
						</view>
						<image :src="item.wechat_qrcode" mode="" v-else @click="uplodeCode"></image>
					</view>
					<view class="example-code">
						<view class="">例如：</view>
						<image :src="imglink + 'qrcode-demo.jpg'" mode=""></image>
					</view>
				</view>
				<view class="uplode-code-details-tip">
					如何获取：点开微信 > 我的 > 个人信息 > 我的二维码 > 长按保存
				</view>
			</view>
		</view>
		<view class="basics-msg-organization">
			<view class="basics-msg-organization-top">
				机构介绍
			</view>
			<view class="" v-if="textswitch" style="margin-bottom: 40upx;">
				<view class="basics-msg-organization-text-btn" @click="textClose">
					一
				</view>
				<textarea class="basics-msg-organization-text" maxlength="-1" placeholder="请输入机构介绍" v-model="item.store_introduction"/>
			</view>
			<!-- 多图片 -->
			<!-- <view class="" v-for="(item,index) in imglist" :key="index" style="margin-bottom: 40upx;">
				<view class="basics-msg-organization-text-btn" @click="deleteaddOrganizationImg(index)">
					一
				</view>
				<image class="basics-msg-organization-img" :src="item" mode=""></image>
			</view> -->
			<view class=""  v-if="item.store_img != '' && item.store_img != 'null' && item.store_img" style="margin-bottom: 40upx;">
				<view class="basics-msg-organization-text-btn" @click="deleteaddOrganizationImg(index)">
					一
				</view>
				<image class="basics-msg-organization-img" :src="item.store_img" mode=""></image>
			</view>
			<view class="">
				<view class="basics-msg-organization-btn" @click="addOrganizationImg">
					新增图片
				</view>
				<view class="basics-msg-organization-btn" style="position: absolute; right: 30upx;" @click="textswitch = true">
					新增文字
				</view>
			</view>
		</view>
		<view class="save-shop-msg" @click="saveMsg">
			保存店铺信息
		</view>
		<!-- 地址选择 -->
		<view v-if="visible">
			<picker-view class="birthday" :indicator-style="indicatorStyle" :value="index" @change="bindChange">
				<picker-view-column>
					<view class="item" v-for="item in provinceList" :key="item.province_id">{{item.province}}省</view>
				</picker-view-column>
				<picker-view-column>
					<view class="item" v-for="item in cityListDetails" :key="item.city_id">{{item.city}}</view>
				</picker-view-column>
				<picker-view-column>
					<view class="item" v-for="item in prefectureDetailList" :key="item.country_id">{{item.country}}</view>
				</picker-view-column>
			</picker-view>
			<view @click="sure" class="birthday-tkang" v-if="visible"></view>
			<view class="determine" @click="sure">确定</view>
		</view>
	</view>
</template>

<script>
	import mpvuePicker from '@/components/mpvue-picker/mpvuePicker.vue';
	import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
	import {uploadFile} from '@/common/alioss.js'
	export default{
		components:{mpvuePicker,mpvueCityPicker},
		data(){
			return{
				imglink: this.$store.state.imgLink,
				// 机构介绍图片多图片
				// imglist:[],
				textswitch:false,
				// 培训科目
				subject:[],
				// 科目id
				subjectId:[],
				// 机构logo
				logo:'https://tool.tuanhaoke.cn/static/image/person.png',
				pickerText: '',
				themeColor: '#007AFF',
				mode: '',
				deepLength: 3,
				cityPickerValueDefault: [0, 0, 1],
				pickerValueDefault: [0],
				pickerValueArray:[],
				provinceId:'',
				cityiD:'',
				item:{}, 
				visible:false,
				provinceList:[],
				cityList:[],
				indicatorStyle: `height: ${Math.round(uni.getSystemInfoSync().screenWidth/(750/100))}px;`,
				index:[0,0,0],
				cityListDetails:[],
				prefecture:'',
				prefectureId:'',
				prefectureDetailList:[],
				value:[0,0,0],
				store_id:'',
				dingwei:[],
				long_lati:'',
			}
		},
		onLoad(option) {
			console.log(option,"9766")
			let store_id = parseInt(option.store_id,10);
			console.log('进入了onload 获取url的store_id',store_id)
			if(!store_id > 0){
				store_id = uni.getStorageSync('store_id')?parseInt(uni.getStorageSync('store_id'),10):0
			}else{
				uni.setStorageSync('store_id', store_id)
			}

			this.store_id = parseInt(store_id,10)
			this.$store.commit('updateStoreId',store_id)
			this.item = uni.getStorageSync('shopMsg')
			console.log(uni.getStorageSync('shopMsg'),"1008699")
			if(Number(option.type) == 2){
				this.item={}
				this.item.long_lati_local = decodeURI(option.poiname);
				console.log("pppppppppppppppppp")
				console.log(option.poiname,"789")
				this.addressList(option.lat,option.lng)
				console.log(this.item.long_lati_local,option.lat,option.lng,"+++++++++++++++++++++++++++++++++++++++++++++++");
			}
			console.log(this.dingwei,"+++++++++++++++++++++++++++++++++");
			
			console.log(this.item)
			// if( this.item.province.province_id != '' ){
			// 	this.provinceId = this.item.province.province_id
			// 	this.cityiD = this.item.city.city_id
			// 	this.prefectureId = this.item.country.country_id
			// 	this.pickerText = this.item.province.province + '省' + this.item.city.city + this.item.country.country
			// }
			this.logo = this.item.store_logo
			this.img = this.item.store_img
			
			if( this.item.store_introduction != '' && this.item.store_introduction != 'null' ){
				this.textswitch = true
			}
			if( this.item.long_lati ){
				var long = this.item.long_lati.split(',')
				long.forEach((item) => {
					this.dingwei.push(Number(item))
				})
			}

			
			
		},
		
		onShow() {
			this.getCity()
			if( this.subjectId == '' ){
				this.getAllAubjects()
			}
			let data=uni.getStorageSync('storeLocation')
			if(data){
				console.log(data,"data=")
				// this.item=data.item
				this.item.customer_store_id=data.customer_store_id
				this.item.name=data.name
				// this.provinceId=data.province
				// this.cityiD=data.city
				// this.prefectureId=data.country
				this.item.address=data.address
				this.item.contact=data.contact
				this.item.telephone=data.telephone
				this.item.wechat_qrcode=data.wechat_qrcode
				this.item.wechat_number=data.wechat_number
				this.item.store_img=data.store_img
				this.item.store_introduction=data.store_introduction
				this.logo=data.store_logo
				this.subjectId=data.subjects_id
				this.pickerText=data.pickerText
				this.index=data.index
				// this.dingwei=long_lati
				// this.item.long_lati_local=data.long_lati_local,
			}
			// console.log(this.item,"ooooooooooooooooooooooo")
			// let items=uni.getStorageSync('item')
			// #ifdef MP-WEIXIN
				const chooseLocation = requirePlugin('chooseLocation');
				const location = chooseLocation.getLocation(); // 如果点击确认选点按钮，则返回选点结果对象，否则返回null
				console.log(location,"444444444444444444444444");
				if(uni.getStorageSync('shopMsg')==""){
					console.log("我进来了")
					this.item={}
					this.item.long_lati_local = location.address;
				}else{
					this.item.long_lati_local = location.address;
				}
				this.addressList(location.latitude,location.longitude)
			// #endif
		},
		onHide() {
			uni.setStorageSync('shopMsg', this.item)
			// uni.clearStorageSync('storeLocation')
		},
		onUnload() {
			uni.setStorageSync('shopMsg', this.item)
		},
		methods:{
			addressList(latitude,longitude){
				let a = []
				a.push(latitude,longitude)
				this.dingwei = a
				console.log(this.dingwei,"经纬度////////////////////");
			},
			huoqudianpukemu(){
				if( this.item.subjects_id ){
					let ojbk=this.item.subjects_id.split(",")
					for(let i=0;i<ojbk.length;i++){
						this.LoadchoseForm(parseInt(ojbk[i]));
						this.subjectId.push(parseInt(ojbk[i]))
					}
				}
			},
			LoadchoseForm(data){
				this.subject.forEach(item => {
					if(item.id == data && item.is_check==0){
						item.is_check = 1
					}
				})
			},
			// 定位
			location(item){
				let data = {
					token:this.$store.getters.getToken,
					customer_store_id:this.item.customer_store_id,
					name:this.item.name,
					province:this.provinceId,
					city:this.cityiD,
					country:this.prefectureId,
					address:this.item.address,
					contact:this.item.contact,
					telephone:this.item.telephone,
					wechat_qrcode:this.item.wechat_qrcode,
					wechat_number:this.item.wechat_number,
					store_img:this.item.store_img,
					store_introduction:this.item.store_introduction,
					store_logo:this.logo,
					subjects_id:this.subjectId,
					long_lati:this.dingwei,
					long_lati_local:this.item.long_lati_local,
					pickerText:this.pickerText,
					index:this.index
					
				}
				console.log(data)
				// uni.setStorageSync('item',this.item)
				uni.setStorageSync('storeLocation',data)
				// #ifdef H5
					this.dingwei = ''
					uni.navigateTo({
						url: 'shopAddress?type=1'
					})
				// #endif
				// #ifdef MP-WEIXIN
					const key = this.$store.state.qqmapkey; //使用在腾讯位置服务申请的key
					const referer = '团好课课拍'; //调用插件的app的名称
					wx.navigateTo({
					  url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer
					});
				// #endif
			},
			// 获取培训科目
			getAllAubjects(){
				let data  = {
						token:this.$store.getters.getToken,
						// customer_id:1,
						customer_id:this.$store.getters.getCustomerId,
						store_id:this.$store.getters.getStoreId,
					}
				this.$api.get_allAubjects(data).then(res => {
					console.log(res)
					if(res.status){
						this.subject = res.data
						this.huoqudianpukemu()
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none',
							duration:2000
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 添加机构介绍图片
			addOrganizationImg(){
				const that = this;
				uni.chooseImage({
					count:1,
					sizeType: ['original', 'compressed'],
				    success: (chooseImageRes) => {
						console.log(chooseImageRes,'chooseImageRes');
						uni.getImageInfo({
							src: chooseImageRes.tempFilePaths[0],
							success: (image) => {
								uni.showLoading({
									title: '图片上传中'
								})
								
								uploadFile(chooseImageRes.tempFilePaths[0]).then(res => {
									console.log(res)
									if(res.status){
										that.item.store_img = res.data.url
										// that.imglist.push(res.data.url)
										uni.setStorageSync('images',that.images)
										// uni.hideLoading()
									}
								}).catch(err => {
									uni.showToast({
										title:err,
										icon:'none',
										duration:5000,
									})
								})
							}
						})
					}
				})
			},
			// 删除机构介绍图片
			deleteaddOrganizationImg(index){
				// this.imglist.splice(index,1);
				this.item.store_img = '';
			},
			textClose(){
				this.textswitch = false
				this.item.store_introduction = ''
			},
			// 科目选择
			choseForm(data){
				this.subject.forEach(item => {
					if(item.id == data.id && item.is_check==0){
						item.is_check = 1
						this.subjectId.push(data.id)
						console.log(this.subjectId);
					}else if (item.id == data.id && item.is_check==1){
						console.log(this.subjectId,"删除");
						item.is_check = 0
						var aaid = []
						this.subjectId.forEach(i => {
							if( i != data.id ){
								aaid.push(i)
							}
						})
						this.subjectId = aaid
						// this.subjectId = this.subjectId.filter(i => i != data.id)
						console.log(this.subjectId,"删除");
					}
				})
			},
			// 更换 logo
			replaceLogo(){
				const that = this;
				uni.chooseImage({
					count:1,
					sizeType: ['original', 'compressed'],
				    success: (chooseImageRes) => {
						console.log(chooseImageRes,'chooseImageRes');
						uni.getImageInfo({
							src: chooseImageRes.tempFilePaths[0],
							success: (image) => {
								uni.showLoading({
									title: '图片上传中'
								})
								
								uploadFile(chooseImageRes.tempFilePaths[0]).then(res => {
									console.log(res)
									if(res.status){
										that.logo = res.data.url
										// that.images.splice(index,1,res.data.url)
										uni.setStorageSync('images',that.images)
										// uni.hideLoading()
									}
								}).catch(err => {
									uni.showToast({
										title:err,
										icon:'none',
										duration:5000,
									})
								})
							}
						})
					}
				})
			},
			//地区
			bindChange: function (e){
				this.value  =e.detail.value
				this.cityListDetails = this.cityList[e.detail.value[0]]
				this.prefectureDetailList = this.cityListDetails[e.detail.value[1]].children
			},
			sure(){
				this.visible = false
				this.tkang = false
				this.province = this.provinceList[this.value[0]].province
				this.city = this.cityListDetails[this.value[1]].city
				this.provinceId = this.provinceList[this.value[0]].province_id
				this.cityiD = this.cityListDetails[this.value[1]].city_id
				this.prefecture = this.prefectureDetailList[this.value[2]].country
				this.prefectureId = this.prefectureDetailList[this.value[2]].country_id
				console.log(this.province,this.city,this.prefectureId)
				console.log(this.provinceId,this.cityiD,this.prefectureId)
				this.pickerText = `${this.province}省-${this.city}-${this.prefecture}`
			},
			getCity(){
				this.$api.gain_all_city({token:this.$store.getters.getToken}).then(res => {
					console.log(res)
					if(res.status){
						this.provinceList = res.list
						this.provinceList.forEach(item => {
							this.cityList.push(item.children)
						})
						this.cityListDetails = this.cityList[0]
						console.log(this.cityListDetails)
						this.prefectureDetailList = this.cityListDetails[0].children
						uni.removeStorageSync('storeLocation')
						
					}
				}).catch(err => {
					console.log(err)
				})
			},
			verification(){
				let flag = true
				let regEn = /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im,
					regCn = /[·！#￥（——）：；“”‘、，|《。》？、【】[\]]/im;
					if(this.item.name == ''){
						uni.showToast({
							title:'店铺名称不得为空',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.item.long_lati_local == ''){
						uni.showToast({
							title:'请先进行定位',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.pickerText == ''){
						uni.showToast({
							title:'请选择店铺地区',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.item.address == ''){
						uni.showToast({
							title:'详细地址不得为空',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.item.contact == ''){
						uni.showToast({
							title:'联系人姓名不得为空',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.item.telephone == ''){
						uni.showToast({
							title:'联系人号码不得为空',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(this.item.wechat_number == ''){
						uni.showToast({
							title:'老师微信号不能为空',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					if(regEn.test(this.item.contact) || regCn.test(this.item.contact)){
						uni.showToast({
							title: "联系人姓名不能包含特殊字符",
							duration: 2000,
							mask: true,
							icon: "none"
						})
						return flag = false
					}
					if(this.item.subjectId == ''){
						uni.showToast({
							title:'请选择店铺培训科目',
							icon:'none',
							duration:2000
						})
						return flag = false
					}
					return flag
			},
			// 修改店铺信息
			saveMsg(){
				if(this.verification()){
					let data = {
						token:this.$store.getters.getToken,
						// customer_id:this.$store.state.userId || uni.getStorageSync('customer_id'),
						customer_store_id:this.item.customer_store_id,
						name:this.item.name,
						province:this.provinceId,
						city:this.cityiD,
						country:this.prefectureId,
						address:this.item.address,
						contact:this.item.contact,
						telephone:this.item.telephone,
						wechat_qrcode:this.item.wechat_qrcode,
						wechat_number:this.item.wechat_number,
						store_img:this.item.store_img,
						store_introduction:this.item.store_introduction,
						store_logo:this.logo,
						subjects_id:this.subjectId,
						long_lati:this.dingwei,
						long_lati_local:this.item.long_lati_local
					}
					console.log("data++++++++",data);
					this.$api.uplode_shop_msg(data).then(res => {
						console.log(res)
						if(res.status){
							// uni.clearStorageSync('storeLocation')
							if(uni.getStorageSync('storeLocation')){
								uni.removeStorageSync('storeLocation')
							}
							uni.showToast({
								title:'修改店铺信息成功',
								icon:'none',
								duration:2000
							})
							setTimeout(() => {
								uni.navigateTo({
									url:'/pages/memberCenter/shop/shopMsg?store_id=' + this.store_id 
								})
							},1000)
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none',
								duration:2000
							})
						}
					}).catch(err => {
						console.log(err)
					})
				}
			},
			chooseCity(){
				this.visible = true
			},
			onConfirm(e) {
				this.provinceId = e.value[0]
				this.cityiD = e.value[1]
				let pickerTextArr = e.label.split('-')
				this.pickerText = pickerTextArr[0] + pickerTextArr[1] + pickerTextArr[2]
				console.log(this.pickerText)
			},
			emptyData(id){
				if(id == '1'){
					this.item.name = ''
				}else if(id == '2'){
					this.item.address = ''
				}else if(id == '3'){
					this.item.contact = ''
				}else if(id == '4'){
					this.item.telephone = ''
				}else if(id == '5'){
					this.item.wechat_number = ''
				}
			},
			uplodeCode(){
				uni.chooseImage({
					sizeType: ['original', 'compressed'],
				    success: (chooseImageRes) => {
						// if (!/\.(gif|jpg|jpeg|png|bmp)$/.test(chooseImageRes.tempFiles[0].name)) {
						// 	uni.showToast({
						// 		title:'图片类型必须为gif/jpg/jpeg/png/bmp',
						// 		icon:'none',
						// 		duration:2000
						// 	})
						// 	return false;
						// }
						console.log(chooseImageRes)
				        // this.tempFilePaths = chooseImageRes.tempFilePaths[0];
					    uni.getImageInfo({
						    src: chooseImageRes.tempFilePaths[0],
						    success: (img) => {
								uni.showLoading({
									title: '图片上传中'
								})
								uploadFile(chooseImageRes.tempFilePaths[0]).then(res => {
									console.log(res)
									if(res.status){
										this.item.wechat_qrcode = res.data.url
										// this.list.image[index]= res.data.url
										// uni.hideLoading()
									}
								}).catch(err => {
									console.log(err)
								})
							}
				       })
				    }
				});
			}
		}
	}
</script>

<style>
	.birthday{
		position: fixed;
		left: 40upx;
		right: 40upx;
		margin: 0;
		transform: translate(0,-50%);
		top: 50%;
		bottom: 0;
		z-index: 888;
		height: 400upx;
		background: #fff;
		text-align: center;
	}
	.determine{
		position: fixed;
		top: 37%;right: 40upx;
		transform: translate(0,-50%);
		font-size: 35upx;
		color: #FFFFFF;
		padding: 20upx;
		z-index: 999;
		background: #FF8B46;
	}
	.birthday-tkang{
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 300;
		opacity: 0.5;
		background: #000000;
	}
	page{
		background: #F3F3F4;
	}
	.shop-amend-page{
		width: 100%;
		padding-bottom: 30upx;
		box-sizing: border-box;
	}
	.basics-msg{
		width: 100%;
		background: #FFFFFF;
		padding-left: 30upx;
		padding-top: 40upx;
		box-sizing: border-box;
	}
	.explain-title{
		display: flex;
		width: 100%;
		padding: 32upx 0;
		box-sizing: border-box;
	}
	.explain-title>view:first-child{
		width: 8upx;
		height: 32upx;
		background: #FF8B46;
		margin-top: 10upx;
	}
	.explain-title>view:last-child{
		color: #333333;
		font-size: 30upx;
		line-height: 48upx;
		margin-left: 10upx;
	}
	.basics-msg-details,.basics-msg-details-addre{
		width: 100%;
		display: flex;
		padding: 28upx 30upx 28upx 0;
		box-sizing: border-box;
		border-bottom: 1upx solid #DEDEDE;
		font-size: 28upx;
	}
	.basics-msg-details>view,.basics-msg-details-addre>view{
		color: #666666;
		margin-top: 4upx;
	}
	.basics-msg-details>view:last-child{
		flex-grow: 1;
		justify-content: space-between;
		display: flex;
		margin-left: 40upx;
	}
	.basics-msg-details>view>input{
		color: #333333;
		font-size: 28upx;
		flex-grow: 1;
	}
	.basics-msg-details>view>image,.basics-msg-details-msg>image{
		width: 32upx;
		height: 32upx;
		margin-top: 6upx;
	}
	.basics-msg-addre{
		width: 100%;
		display: flex;
		padding: 28upx 30upx 28upx 0;
		box-sizing: border-box;
		border-bottom: 1upx solid #DEDEDE;
		font-size: 28upx;
	}
	.basics-msg-addre>view:first-child{
		color: #666666;
	}
	.basics-msg-addre>view>input{
		color: #333333;
		font-size: 28upx;
		flex-grow: 1;
	}
	.basics-msg-addre>view>image{
		width: 20upx;
		height: 26upx;
		margin-top: 6upx;
	}
	.basics-msg-details-addre>view{
		color: #666666;
		font-size: 28upx;
		width: 112upx;
	}
	.basics-msg-details-addre{
		border-bottom: 0;
		border-bottom: 1upx solid #DEDEDE;
	}
	.basics-msg-details-msg{
		display: flex;
		justify-content: space-between;
		margin-left: 40upx;
		flex-grow: 1;
		height: 80upx;
		position: relative;
	}
	.basics-msg-details-msg>textarea{
		height: 80upx;
		font-size: 28upx;
		color: #333333;
	}
	.basics-msg-details-msg>image{
		position: absolute;
		bottom: 0;right: 0;
	}
	.basics-msg-person{
		width: 100%;
		margin-top: 20upx;
		padding-left: 30upx;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	.basics-msg-person-name{
		width: 100%;
		display: flex;
		border-bottom: 1upx solid #DEDEDE;
		padding: 32upx 30upx 28upx 0;
		box-sizing: border-box;
	}
	.basics-msg-person-name>view:first-child{
		color: #666666;
		font-size: 28upx;
		margin-top: 4upx;
	}
	.basics-msg-person-name>view:last-child{
		display: flex;
		justify-content: space-between;
		flex-grow: 1;
		margin-left: 68upx;
	}
	.basics-msg-person-name>view>input{
		flex-grow: 1;
		color: #333333;
		font-size: 28upx;
	}
	.basics-msg-person-name>view>image{
		width: 30upx;
		height: 30upx;
		margin-top: 6upx;
	}
	.uplode-code{
		width: 100%;
		border-bottom: 1upx solid #DEDEDE;
		color: #666666;
		font-size: 28upx;
		padding: 32upx 0 28upx 0;
		box-sizing: border-box;
	}
	.uplode-code-details{
		width: 100%;
		padding: 18upx 0 30upx 0 ;
		box-sizing: border-box;
	}
	.uplode-code-details-tip{
		color: #999999;
		font-size: 24upx;
		margin-top: 30upx;
	}
	.uplode-code-details-content{
		display: flex;
	}
	.uplode-code-content{
		width: 284upx;
	}
	.uplode-code-content>image{
		width: 100%;
		height: 284upx;
		margin-top: 20upx;
	}
	.uplode-code-content>view:first-child{
		color: #333333;
		font-size: 24upx;
	}
	.uplode-code-content-details{
		width: 100%;
		height: 284upx;
		background: #F4F5F9;
		padding-top: 88upx;
		box-sizing: border-box;
		margin-top: 10upx;
	}
	.uplode-code-content-details>image{
		width: 64upx;
		height: 64upx;
		margin-left: 110upx;
	}
	.uplode-code-content-details>view{
		text-align: center;
		color: #666666;
		font-size: 24upx;
		margin-top: 10upx;
	}
	.example-code{
		width: 284upx;
		margin-left: 92upx;
	}
	.example-code>view{
		color: #333333;
		font-size: 24upx;
	}
	.example-code>image{
		width: 100%;
		height: 284upx;
		margin-top: 10upx;
	}
	.save-shop-msg{
		width: 600upx;
		height: 80upx;
		line-height: 80upx;
		margin: 0 auto;
		margin-top: 36upx;
		border-radius: 44upx;
		background: linear-gradient(to right,#FE9543,#FF664F);
		box-shadow: 0 8upx 16upx 0 rgba(166, 13, 0, 0.23);
		color: #FFFFFF;
		font-size: 32upx;
		text-align: center;
	}
	/* 课拍拍 */
	.basics-msg-logo{
		width: 250upx;
		height: 250upx;
		margin: 0upx 30upx 40upx 230upx;
		border-radius: 300upx;
	}
	.basics-msg-logo>image{
		width: 250upx;
		height: 250upx;
		border-radius: 300upx;
	}
	.basics-msg-logo>view{
		position: absolute;
		margin-top: -129upx;
		margin-left: 0upx;
		width: 250upx;
		height: 125upx;
		text-align: center;
		font-size: 32upx;
		line-height: 100upx;
		border-bottom-right-radius: 2000upx;
		border-bottom-left-radius: 2000upx;
		background: rgba(0,0,0,0.65); 
		color: #ffffff;
	}
	.collect-information{
		position: relative;
		font-family: PingFangSC-Medium;
		margin-top: 30upx;
		margin-bottom: 20upx;
		line-height: 42upx;
		letter-spacing: 0;
		font-size: 30upx;
		color: #666666;
	}
	.arrange{
	}
	.collect-reversal{
		display: inline-block;
		margin-bottom: 40upx;
		margin-right: 35upx;
		padding: 10upx 20upx;
		border: 1upx solid #CBC7C7;
		border-radius: 6upx;
		font-size: 28upx;
		height: 50upx;
		width: 160upx;
		line-height: 50upx;
		text-align: center;
		background: #FFFFFF;
		color: #666666;
	}
	.reversal{
		color: #FF664F;
		border: 1upx solid #FF664F;
		background-image: url(https://tool.tuanhaoke.cn/static/image/member/hook.svg);
		background-repeat: no-repeat;
		background-size: 30rpx 30rpx;
		background-position: right bottom;  
	}
	.basics-msg-organization{
		padding: 0upx 30upx 30upx 30upx;
		margin-top: 20upx;
		background-color: #ffffff;
	}
	.basics-msg-organization-top{
		width: 232upx;
		height: 60upx;
		color: #ffffff;
		line-height: 60upx;
		text-align: center;
		margin-left: 235upx;
		margin-bottom: 30upx;
		font-size: 30upx;
		background-image: url(https://tool.tuanhaoke.cn/static/image/shortvideo/home_image_background@2x.png);
		background-size: 100% 100%;
	}
	.basics-msg-organization-text{
		width: 640upx;
		font-size: 28upx;
		padding: 20upx;
		background: #F4F5F9;
		border: 1px solid #E6E6E6;
		border-radius: 4px;
	}
	.basics-msg-organization-text-btn{
		position: absolute;
		z-index: 999;
		right: 20upx;
		width: 38upx;
		height: 38upx;
		margin-top: -24upx;
		text-align: center;
		font-size: 20upx;
		line-height: 38upx;
		border-radius: 100upx;
		background-color: #000000; 
		color: #ffffff;
	}
	.basics-msg-organization-img{
		height: 410upx;
		width: 685upx;
	}
	.basics-msg-organization-btn{
		display: inline-block;
		width: 300upx;
		line-height: 68upx;
		font-size: 28upx;
		text-align: center;
		border-radius: 15upx;
		background-color: #ffffff;
		border: 1px solid #FF8B46;
		color: #FF8B46;
		border-radius: 45upx;
		vertical-align: middle;
	}
</style>
